import {messages} from "share/common";
import React from 'react'
import { connect } from 'react-redux'
import { Form, Tag, message } from 'antd'

import { SelectDepOrPerson } from 'components/index'
import RSService from 'containers/setting/role-setting/role-setting.service'
import 'styles/setting/role-setting/finance-role/finance-role-detail.scss'

class DetailDepartmentAuth extends React.Component{
  constructor(props) {
    super(props);
    this.state = {
      department: [],
    }
  }

  componentDidMount() {
    this.setState({ department: this.props.department || [] })
  }

  componentWillReceiveProps(nextProps) {
    this.setState({ department: nextProps.department || [] })
  }

  //获取基本信息
  getBasicInfo = () => {
    RSService.getFinanceRoleDetail(this.props.roleOID).then(res => {
      this.setState({ department: res.data.department || [] })
    })
  };

  handleAddDep = (values) => {
    let params = {roleOID: this.props.roleOID};
    let departmentOIDs = [];
    values.map(item => {
      departmentOIDs.push(item.departmentOID)
    });
    params.departmentOIDs = departmentOIDs;
    RSService.createDepartment(params).then(() => {
      this.getBasicInfo()
    })
  };

  handleDelete = (e, value) => {
    e.preventDefault();
    let params = {
      roleOID: this.props.roleOID,
      departmentOIDs: [value]
    };
    RSService.deleteDepartment(params).then(() => {
      message.success(messages('common.delete.success', {name: ''}));
      this.getBasicInfo()
    })
  };

  render() {
    const { roleBaseInfo } = this.props;
    const { department } = this.state;
    return (
      <div className="detail-department-auth">
        {/*系统预设角色不可编辑部门权限*/}
        {roleBaseInfo.roleID !== 'SuperAud' && roleBaseInfo.roleID !== 'SuperFin' && (
          <SelectDepOrPerson buttonType="primary"
                             title={messages('common.edit')}
                             onlyDep={true}
                             onConfirm={this.handleAddDep}/>
        )}
        {(roleBaseInfo.roleID === 'SuperAud' || roleBaseInfo.roleID === 'SuperFin') && (<Tag>{messages('common.all')}</Tag>)}
        {roleBaseInfo.roleID !== 'SuperAud' && roleBaseInfo.roleID !== 'SuperFin' && (
          <div className="tags-chosen">
            {department.map(item => {
              return <Tag key={item.departmentOID}
                          closable={roleBaseInfo.roleID !== 'SuperAud' && roleBaseInfo.roleID !== 'SuperFin'}
                          onClose={e => this.handleDelete(e, item.departmentOID)}>{item.name}</Tag>
            })}
          </div>
        )}
      </div>
    )
  }
}

DetailDepartmentAuth.propTypes = {
  department: React.PropTypes.array,
  roleBaseInfo: React.PropTypes.object,
  roleOID: React.PropTypes.string,
};

DetailDepartmentAuth.contextTypes = {
  router: React.PropTypes.object
};

function mapStateToProps(state) {
  return {
    profile: state.login.profile,
  }
}

const wrappedDetailDepartmentAuth = Form.create()(DetailDepartmentAuth);

export default connect(mapStateToProps)(wrappedDetailDepartmentAuth)
